<div class="layuimini-container layuimini-page-anim">
	<div class="layuimini-main">

		<script type="text/html" id="toolbarDemo">
			<div class="layui-btn-container">
				<button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add"> 添加</button>
			</div>
		</script>

		<script type="text/html" id="addContent">
			<div style="margin: 10px 10px 10px 10px">
				<form class="layui-form layui-form-pane" lay-filter="data-form">
					<div class="layui-form-item">
						<div class="layui-inline">
							<label class="layui-form-label">机型名称</label>
							<div class="layui-input-inline">
								<input type="text" lay-verify="required" name="name" autoComplete="off" class="layui-input" />
							</div>
						</div>
						<div class="layui-inline"><a class="layui-btn layui-btn-primary" lay-submit lay-filter="data-add-btn"><i class="layui-icon"></i> 添加 </a>
						</div>
					</div>
				</form>
			</div>
		</script>

		<table class="layui-hide" id="currentTableId" lay-filter="currentTableFilter"></table>

		<script type="text/html" id="currentTableBar">
			<a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
		</script>

	</div>

</div>

<script>
	layui.use(['form', 'table', 'element'], function () {
		var $ = layui.jquery,
			form = layui.form,
			table = layui.table;

		table.render({
			elem: '#currentTableId',
			url: '/api/AircraftModel',
			toolbar: '#toolbarDemo',
			defaultToolbar: ['filter', 'exports', 'print'],
			cols: [[
				{field: 'id', title: 'ID', sort: true},
				{field: 'name', title: '机型', edit: 'text'},
				{title: '操作', toolbar: '#currentTableBar', align: "center"}
			]],
			limits: [10, 20, 50, 100],
			limit: 10,
			page: true
		});

		// toolbar事件监听
		table.on('toolbar(currentTableFilter)', function (obj) {
			if (obj.event === 'add') {
				// 监听添加操作
				var index = layer.open({
					title: '添加',
					type: 1,
					shade: 0.2,
					maxmin: true,
					shadeClose: true,
					area: ['440px', '130px'],
					content: addContent.innerHTML,
				});

				// 监听添加提交
				form.on("submit(data-add-btn)", function (result) {
					$.ajax({
						url: "/api/AircraftModel",
						data: result.field,
						type: "POST",
						dataType: "json",
						success: function (res) {
							layer.close(index); // 关闭add弹出层
							if (res.code == 0) {
								layer.msg("添加成功", {icon: 1, time: 2000});
							} else {
								layer.msg(res.msg, {icon: 2, time: 2000});
							}
							table.reload('currentTableId');
						},
					});
				});
			}
		});

		//监听单元格编辑
		table.on('edit(currentTableFilter)', function (obj) {
			var value = obj.value //得到修改后的值
				, data = obj.data //得到所在行所有键值
				, field = obj.field; //得到字段

			var formData = {'id': data.id};
			formData[field] = value;
			$.ajax({
				url: "/api/AircraftModel/" + data.id,
				data: formData,
				type: "PUT",
				dataType: "json",
				success: function (res) {
					if (res.code == 0) {
						layer.msg('修改成功！');
					} else {
						layer.msg(res.msg);
					}
				}
			});

		});

		//监听单元格工具
		table.on('tool(currentTableFilter)', function (obj) {
			var data = obj.data;
			if (obj.event === 'delete') {
				// 监听删除操作
				layer.confirm('确认是否删除？', function (index) {

					$.ajax({
						url: "/api/AircraftModel/" + data.id,
						type: "DELETE",
						dataType: "json",
						success: function (res) {
							if (res.code == 0) {
								obj.del();
								layer.msg('删除成功！');
							} else {
								layer.msg(res.msg);
							}
						}
					});

					layer.close(index);
				});
			}
		});
	});
</script>
